<script lang="ts">
import {defineComponent} from 'vue'
import ListPage from "@/components/ListPage/index.vue";
import {SearchListParams, SearchListResult} from "@/components/ListPage/type";
import {downloadReq} from "@/api/download";
import DynamicTable from "@/components/DynamicTable3/index.vue";
import {TableConfigItem} from "@/components/DynamicTable3/types";
import DynamicForm from "@/components/DynamicForm3/index.vue";
import {FormConfigItem} from "@/components/DynamicForm3/types";
import {useDict} from "@/utils/dict.ts";
import AddTask from "@/views/download/AddTask.vue";
import {EditDirOptions} from "@/config/options";
import {ElMessage, ElMessageBox} from "element-plus";
import {checkPermission} from "@/utils/permission.ts";
import ThreadManager from "@/views/download/ThreadManager.vue";

export default defineComponent({
  name: "Download",
  components: {ThreadManager, AddTask, DynamicForm, DynamicTable, ListPage},
  data() {
    return {
      formData:{},
      tableConfgList: [
        {
          label: '任务名称',
          prop: 'downloadName',
          minWidth: '120px',
        },
        {
          label: '任务id',
          prop: 'downloadTaskId',
          minWidth: '120px',
        },
        {
          label: '任务参数',
          prop: 'downloadParams',
          minWidth: '120px',
        },
        {
          label: '任务类型',
          prop: 'downloadType',
          minWidth: '120px',
        },
        {
          label: '任务状态',
          prop: 'downloadStatus',
          minWidth: '120px',
        },
        {
          label: '操作',
          slotName: 'caozuo',
          align: 'center',
          minWidth: '120px',
        },
      ] as TableConfigItem[],
      formConfigList:[
        {
          type: 'input',
          label: '任务名称',
          prop: 'downloadName',
          props: {
            clearable: true,
          },
          search: true,
        },
        {
          type: 'select',
          label: '任务类型',
          prop: 'downloadType',
          props: {
            options: [],
            clearable: true,
          },
          search: true,
        },
      ] as FormConfigItem[],
      timer: null,
    }
  },
  created() {
    useDict('getDownloadListType',({getDownloadListType})=>{
      const find = this.formConfigList.find(i=>i.prop === 'downloadType')
      find.props.options = getDownloadListType
    })
  },
  mounted() {
    this.$nextTick(()=>{
      this.timer = setInterval(()=>{
        this.$refs.ListPageRef.getList()
      },3000)
    })
  },
  beforeUnmount() {
    clearInterval(this.timer)
  },
  methods:{
    checkPermission,
    searchList(search:SearchListParams):Promise<SearchListResult> {
      return downloadReq.getDownloadList({
        ...this.formData,
        ...search,
      }).then(res=>{
        return {
          list: res.data.records,
          total: res.data.total,
        }
      })
    },
    async resetGetList2(){
      await this.$refs.DynamicFormRef.resetFields()
      this.$refs.ListPageRef.resetGetList()
    },
    success() {
      this.$refs.ListPageRef.getList()
    },
    deleteRow(row){
      ElMessageBox.confirm("是否删除","提示").then(()=>{
        downloadReq.delDownload(row.downloadTaskId).then((res)=>{
          ElMessage.success(res.data as string)
          this.success()
        })
      })
    },
    downloadAgain(row){
      ElMessageBox.confirm("是否重新下载","提示").then(()=>{
        downloadReq.downloadAgain(row.downloadTaskId).then((res)=>{
          ElMessage.success(res.data as string)
          this.success()
        })
      })
    },
    lookRow(row){
      this.$refs.AddTaskRef.open({
        row: row,
        edit: EditDirOptions.look
      })
    },
    addTask() {
      this.$refs.AddTaskRef.open({
        edit: EditDirOptions.add
      })
    }
  }
})
</script>

<template>
  <div class="app-container">
    <ListPage
      ref="ListPageRef"
      :search-list="searchList"
      :show-pagination="false"
    >
      <template #search="{getList,resetGetList}">
        <div>
          <DynamicForm
            v-model="formData"
            search
            ref="DynamicFormRef"
            :created-init-value="false"
            :form-config-list="formConfigList"
            @search="getList"
          >
            <el-form-item>
              <el-button
                type="primary"
                @click.stop="getList"
              >搜索</el-button>
              <el-button
                @click.stop="resetGetList2"
              >重置</el-button>
            </el-form-item>
          </DynamicForm>
        </div>
        <div>
          <AddTask
            ref="AddTaskRef"
            @success="success"
          ></AddTask>
          <el-button
            type="primary"
            @click="addTask"
          >添加任务</el-button>
          <template v-if="checkPermission(['initAdmin'])">
            <ThreadManager
              ref="ThreadManagerRef"
              @success="success"
            ></ThreadManager>
            <el-button
              type="primary"
              @click="()=>{$refs.ThreadManagerRef.open()}"
            >线程信息</el-button>
          </template>
        </div>
      </template>
      <template #list="{listData,listHeight,loading}">
        <DynamicTable
          :data="listData"
          :created-init-value="false"
          :height="listHeight"
          :table-config-list="tableConfgList"
        >
          <template #downloadTaskId_default="{row, column, $index,tableData}">
            <el-button
              type="primary"
              text
              @click.stop="lookRow(row)"
            >{{ row[column.property] }}</el-button>
          </template>
          <template #caozuo_default="{row, column, $index,tableData}">
            <el-button
              type="danger"
              text
              @click.stop="deleteRow(row)"
            >删除</el-button>
            <el-button
              v-if="row.downloadStatus === '下载完成'"
              type="primary"
              text
              @click.stop="downloadAgain(row)"
            >重新下载</el-button>
          </template>
        </DynamicTable>
      </template>
    </ListPage>
  </div>
</template>

<style scoped lang="scss">

</style>
